<template>
  <div class="bigbox">
    <div id="lianxi">
      <div class="jr">
        <span class="j">单词训练</span>
        <p class="dz">多种方式复习,单词记忆更牢固</p>
      </div>
      <div class="xl"   @click="fun()">去训练</div>
    </div>
    <div style="height: 0.1rem; background: #f9f9f9"></div>
  </div>
</template>

<script>
export default {
  methods:{
    fun(){
      this.$router.push("/start")
    }
  }
};
</script>

<style scoped>

#lianxi {
  width: 3.47rem;
  height: 0.63rem;
  margin: auto;
  /* background: pink; */
  display: flex;
  align-items: center;
  /* =========================================== */
  margin-top: .8rem;

}
.jr {
  margin-left: 0.2rem;
  margin-right: 0.8rem;
}
.j {
  display: inline-block;
  width: 0.8rem;
  font-size: .16rem;
  font-weight: 600;
}
.dz {
  font-size: 0.12rem;
  margin-top: 0.02rem;
   color: #9696a0;
}
.xl {
  width: 0.8rem;
  height: 0.36rem;
  background: #e9ecfb;
  border-radius: 0.06rem;
  font-size: 0.14rem;
  font-weight: 500;
  text-align: center;
  line-height: 0.36rem;
  color: #486eb1;
}
</style>